<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="_fregments :: head(~{::title})">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>选座</title>
    <link rel="stylesheet" href="../../static/css/style.css">
    <link rel="stylesheet" href="../../static/lib/layui/css/layui.css">
</head>

<body>
<!-- 导航栏 -->
<ul th:replace="_fregments :: nav(0)" class="layui-nav m-pl-sm m-pr-sm" lay-filter="">
    <img src="../../static/favicon.ico" width="20px">
    <a href="#" class="logo">
        &nbsp;挚夕影院
    </a>
    <li class="layui-nav-item"><a href=""><i class="layui-icon layui-icon-home">&nbsp;</i>首页</a></li>
    <li class="layui-nav-item"><a href=""><i class="layui-icon layui-icon-windows">&nbsp;</i>电影</a></li>
    <li class="layui-nav-item"><a href=""><i class="layui-icon layui-icon-link">&nbsp;</i>影院</a></li>
    <li class="layui-nav-item"><a href=""><i class="layui-icon layui-icon-tabs">&nbsp;</i>榜单</a></li>
    <span style="display: inline-block; width: 60%;">
            <div style="display: flex; padding-left: 20px;">
                <input type="text" name="title" required lay-verify="required" placeholder="找电影、影院"
                       autocomplete="off"
                       class="layui-input" style="width: 300px;">
                <button class="layui-btn" lay-submit lay-filter="formDemo"><i
                        class="layui-icon layui-icon-search">&nbsp;</i></button>
            </div>
        </span>

    <li class="layui-nav-item" style="text-align: right!important;">
        <a href=""><img src="../../static/images/me.jpg" class="layui-nav-img"></a>
        <dl class="layui-nav-child">
            <dd><a href="javascript:;">修改信息</a></dd>
            <dd><a href="javascript:;">安全管理</a></dd>
            <dd><a href="javascript:;">退出</a></dd>
        </dl>
    </li>

</ul>

<!-- 内容 -->
<div class="layui-container" style="width: 100%; margin: 0%; padding: 0%;">
    <!-- 下面正文 -->
    <div style="margin-left: 10%; margin-right: 10%;  margin-top: 50px;">
        <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <ul class="layui-tab-title">
                <li class="layui-this">个人信息</li>
                <li>订单</li>
            </ul>
            <div class="layui-tab-content" style="height: 100px;">
                <div class="layui-tab-item layui-show">
                    <div class="layui-col-xs2 layui-col-sm2 layui-col-md2">
                        <img th:src="@{/images/me.jpg}" src="../../static/images/me.jpg" width="200px">
                    </div>
                    <div class="layui-col-xs9 layui-col-sm9 layui-col-md9">
                        <div class="layui-form-item">
                            <label class="layui-form-label">用户名</label>
                            <div class="layui-input-block">
                                <input type="text" th:value="${session.user.username}" name="title" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">邮箱</label>
                            <div class="layui-input-block">
                                <input th:value="${session.user.email}" type="text" name="title" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">手机号</label>
                            <div class="layui-input-block">
                                <input th:value="${session.user.phone}" type="text" name="title" class="layui-input">
                            </div>
                        </div>
                    </div>

                </div>
                <div class="layui-tab-item">
                    <table class="layui-table" lay-even lay-skin="nob">
                        <thead>
                        <tr>
                            <th>影片</th>
                            <th>影院</th>
                            <th>时间</th>
                            <th>放映厅</th>
                            <th>座位</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="order : ${orders}">
                            <td th:text="${order.sessionVO.movie.name}">
                                送你一朵小红花
                            </td>
                            <td th:text="${order.sessionVO.cinema.name}">
                                万达影城（经开万达广场店）
                            </td>
                            <td class="m-tc-red" th:text="${#dates.format(order.date, 'yyyy-MM-dd HH:mm:ss')}">
                                2023-11-24 13:00
                            </td>
                            <td th:text="${order.sessionVO.hall.name}">
                                1号激光厅
                            </td>
                            <td>
                                <span th:each="seat : ${order.seats}" style="margin-right: 10px; margin-top: 10px" class="seat-label layui-badge layui-bg-green">
                                    <span th:text="${seat[0] + 1}">3</span>排
                                    <span th:text="${seat[1] + 1}">4</span>座
                                </span>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!--/*/<th:block th:replace="_fregments::script">/*/-->
<script src="../../static/lib/jquery-3.5.1.min.js"></script>
<script src="../../static/lib/layui/layui.js"></script>
<!--/*/</th:block>/*/-->
<script>
    $(function () {

    })
</script>
</body>

</html>